<template>
	<view class="u-page">
		<view class="header"></view>
		<view class="content">
			<view class="selected">
				<view class="example-body">
					<uni-combox :border="false" :candidates="candidates" placeholder="全部日期"></uni-combox>
				
				</view>
				<view class="example-body">
					<uni-combox :border="false" :candidates="candidates1" placeholder="全部"></uni-combox>
				</view>
			</view>
			<view class="walletList">
				<view class="lists" v-for="(item,index) in list" :key="index">
					<view class="list_contnet" >
						<view class="type" v-if="item.type ==1">订单任务奖励</view>
						<view class="type" v-if="item.type ==2">金额任务奖励</view>
						<view class="type" v-if="item.type ==0">充值</view>
						<view class="typeinfo">来源：{{item.slProjectByPid.title}}</view>
						<view class="time">{{item.createtime}}</view>
					</view>
					<view class="right_group">
						<view class="projecttitle">{{item.price}}</view>
						<view class="projectinfo">
							<text class="tag_succes" v-if="item.status == 1">有效</text>
							<text class="tag_defalut" v-else>无效</text>
						<!-- 	<uni-tag text="有效" type="success" :inverted="true" size="mini" v-if="item.status == 1"></uni-tag>
							<uni-tag text="无效" type="default"  size="normal" :circle='true' v-else></uni-tag> -->
						</view>
						<view class="" v-if="item.status == 2">{{item.reason}}</view>
					</view>
					
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				selected:'',
				candidates:["全部日期",'11','222'],
				candidates1:["全部类型","订单任务奖励","金额任务奖励","充值"],
				userData:{},
				list:[],
				
			}
		},
		onLoad() {
			let user = uni.getStorageSync('userData');
			this.userData = user
			this.userbalance();
		},
		
		methods: {
			//获取最近时间日期
			async userbalance(){
				const balance = await this.GQL({
					"operationName": "allSlUserBalanceDetails",
					"query": "query allSlUserBalanceDetails($filter: SlUserBalanceDetailFilter) { allSlUserBalanceDetails(filter:$filter) { nodes { id pid price projectTitle reason status type createtime uid slProjectByPid { title } } } }",
					"variables": {"filter": {"uid":{"equalTo":this.userData.uid}}}
				})
				if(balance.data.allSlUserBalanceDetails.nodes !=''){
					this.list = balance.data.allSlUserBalanceDetails.nodes
				}
				// console.log('1----',balance)
			}
			
		}
	}
</script>

<style lang="scss">
.header{
		position: absolute;
		top: 0px;
		width: 100%;
		height: 200px;
		background: linear-gradient(#C7171E ,#FBFCFE); /* 标准的语法 */
		
	}
	.content{
		position: relative;
		top: 0px;
		margin: 15px;
		
	}
	.selected{
		height: 40px;
		background-color: #FFFFFF;
		border-radius: 5px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 15px;
		font-weight: 400;
		color: #161E3E;
		line-height: 16px;
	}
	.walletList{
		margin-top: 20px;
		border-radius: 5px;
		background-color: #FFFFFF;
		height: 600px;
	}
	.lists{
		display: flex;
		justify-content: space-between;
		height: 100px;
		margin: 15px;
		padding-top: 15px;
		border-bottom: 1px solid #D7D7D7;
		.list_contnet{
			.type{
				font-size: 14px;
				font-weight: 400;
				color: #161E3E;
				line-height: 16px;
				padding: 7px 0px;
			}
			.typeinfo{
				
				font-size: 12px;
				font-weight: 400;
				color: #767B8D;
				line-height: 14px;
				overflow: hidden;
				width: 200px;
				height: 14px;
				margin: 7px 0px;
			}
			.time{
				font-size: 12px;
				font-weight: 400;
				color: #9BA7C1;
				line-height: 12px;
				padding: 7px 0px;

			}
		}
		.right_group{
			text-align: center;
			.projecttitle{
				margin-bottom: 8px;
				color: #C7171E;
				font-size: 16px;
				font-weight: 600;
			}
	
			.tag_succes{
				display: inline-block;
				padding: 2px 14px;
				border-radius: 20px;
				background-color: #E1EDE3;
				color: #539D5D;
				font-size: 12px;
			}
			.tag_defalut{
				display: inline-block;
				padding: 2px 14px;
				border-radius: 20px;
				background-color: #E6EAF2;
				color: #9BA7C1;
				font-size: 12px;
			}
		}
	}
</style>
